<template>
  <div>
    <Navbar :title="title" left-text="返回" left-arrow @click-left="goBack"></Navbar>

    <van-address-list v-model="chosenAddressId" :list="list" default-tag-text="默认" @add="onAdd" @edit="onEdit"
      @select="onSelect" />

    <van-empty v-if="show" image="https://fastly.jsdelivr.net/npm/@vant/assets/custom-empty-image.png" image-size="80"
      description="暂无默认地址" />


  </div>
</template>

<script>
import Navbar from "../Navbar.vue";

export default {
  name: "AddressBase",
  data() {
    return {
      title: "收货地址",
      list: [],
      show: false,
      chosenAddressId: 0,
      userid: "",
      action: '',
      nums: this.$route.query.nums ? this.$route.query.nums : 0,
      idArr: this.$route.query.idArr ? this.$route.query.idArr : 0,
    };
  },
  methods: {
    goBack() {
      if (this.action === 'user') {
        this.$router.push('/user/base/index');
      } else if (this.idArr != null) {
        this.$router.push({ path: '/user/order/buy', query: { action: this.action, nums: this.nums, idArr: this.idArr } });
      } else {
        console.log(-1);
        this.$router.go(-1)
      }

    },
    // TODO 添加地址
    onAdd() {
      if (this.action === 'user') {
        this.$router.push({ name: 'AddressAdd', query: { action: 'user' } });
      } else {
        this.$router.push({ name: "AddressAdd", query: { action: this.action, nums: this.nums, idArr: this.idArr } });
      }
    },
    onEdit(val) {
      console.log(val.id);
      if (this.action === 'user') {
        this.$router.push({ name: 'AddressEdit', query: { id: val.id, action: this.action, } });
      } else {
        this.$router.push({ name: 'AddressEdit', query: { id: val.id, action: this.action, nums: this.nums, idArr: this.idArr } });
      }
    },
    // TODO 初始化地址列表
    async initAddressList(userid) {
      let result = await this.$api.InitAddress({ userid });

      // 获取到data数据并且赋值
      let data = result.data;

      // 空数组
      let list = [];

      // 当没数据提示
      if (data.length <= 0) {
        // this.$notify({
        //   type: "warning",
        //   message: "暂无收货地址",
        //   duration: 1500,
        // });
        // return false;
        this.show = true
        return false;
      }

      // TODO 处理数据
      for (let item of result.data) {
        if (item.status == 1) {
          this.chosenAddressId = item.id;
        }

        let address = {
          id: item.id,
          name: item.consignee,
          tel: item.mobile,
          isDefault: item.status == 1 ? true : false,
        };

        let info = "";

        if (item.provinces) {
          info += `${item.provinces.name}-`;
        }

        if (item.citys) {
          info += `${item.citys.name}-`;
        }

        if (item.districts) {
          info += `${item.districts.name} `;
        }

        if (item.address) {
          info += `${item.address}`;
        }

        // 追加
        address.address = info;

        // 追加到数组
        list.push(address);
      }

      this.list = list;

      this.show = false;
    },
    async onSelect(val) {
      let data = {
        id: val.id,
        userid: this.userid,
      };

      let res = await this.$api.selectAddress(data);

      this.initAddressList(this.userid);
    },
  },
  created() {
    this.userid = this.$cookies.get("ShopUser")
      ? this.$cookies.get("ShopUser").id
      : "";

    this.action = this.$route.query.action ? this.$route.query.action : 'user';

    // console.log(this.$route.query);

    this.initAddressList(this.userid);
  },
  mounted() {
  },
  components: {
    Navbar,
  },
};
</script>

<style scoped>
</style>
